<?xml version="1.0" encoding="UTF-8"?>
<!--
honghiepcao@gmail.com
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>TODO supply a title</title>
    </head>
    <body>
        <script type="text/javascript">
            //<![CDATA[
             function previewImage(input,output) {
                 if (input.files && input.files[0]) {
                        if (!input.files[0].type.match('image.*')) {
                            alert("input image");
                            input.value = "";
                        }else{
                             var reader = new FileReader();
                             reader.readAsDataURL(input.files[0]);

                             reader.onload = function (e) {
                                 output.src= e.target.result;
                             }
                        }

                     
                 }
             }
             
             function previewAudio(input,output) {
                 if (input.files && input.files[0]) {
                        var fileName =input.value
                        if (!input.files[0].type.match('audio.*') && 'mp3'!= (fileName.substring(fileName.length-3,fileName.length)).toLowerCase()) {
                            alert("input audio mp3");
                            input.value = "";
                        }else{
                             var reader = new FileReader();
                             reader.readAsDataURL(input.files[0]);

                             reader.onload = function (e) {
                                 output.src= e.target.result;
                             }
                        }

                     
                 }
             }
             //]]>
        </script>


        <form id="form1">
            <input type='file' onchange="previewImage(this,document.getElementById('im'));" />
            <img id="im" src="#" alt="your image" />
            <input type='file' onchange="previewAudio(this,document.getElementById('au'));" />
            <audio id="au" controls ="controls"/>
        </form>
    </body>
</html>
